import React from 'react';
import Editor from './Editor';

export default function(options = {}) {
  const { ref, tabs = [ 'style', 'property' ] } = options;
  return {
    commands: {
      showPropertyEditor() {
        if (ref.current) {
          ref.current.show();
        }
      },
      closePropertyEditor() {
        if (ref.current) {
          ref.current.close();
        }
      },
    },
    renderEditor: (props, editor, next) => {
      const children = next();
      const {
        value: { selection },
      } = props;
      const node = selection.first();
      return (
        <>
          {children}
          <Editor
            ref={ref} tabs={tabs}
            node={node} editor={editor}
          />
        </>
      );
    },
  };
}
